<template>
	<div>
		<div class="breadcrumb">
			<el-breadcrumb separator="/">
				<el-breadcrumb-item>{{$store.state.company.companyName}}</el-breadcrumb-item>
				<el-breadcrumb-item>智能装备</el-breadcrumb-item>
				<el-breadcrumb-item>物联网装备</el-breadcrumb-item>
			</el-breadcrumb>
		</div>
		<div class="tableNavBox">
			<div class="tableBoxTable" style="margin-bottom: 50px;">
				<tableForm :title="'物联网装备'" :pageData="pageData" :data="data" :addGo="'/IntelligentEquipment/myEquipment/monitoringAdd'">
					<template slot="d" slot-scope="scope" style="cursor: pointer;">
						<span>
							<img src="@/assets/image/digitalOrchard/dingwei.png" alt="" style="margin:0 auto;cursor: pointer;" class="mapBtn" @click="detail(scope.row.row)"/>
						</span>
                    </template>
					<template slot="g" slot-scope="scope">
						<el-button type="text" size=" " style="color:#23B14D" @click="detail(scope.row.row)">查看</el-button>
                    </template>
				</tableForm>
				<pagina-tion :totalNum="pageData.totalNum" @paginaClick="paginaClick"></pagina-tion>
			</div>

			<!-- <el-dialog
			  title="新增设备"
			  :visible.sync="dialogVisible"
			  width="35%"
			  class="equip">
			  <formTemplate :formSet="formSet" :postData="formData" :rules='rules' :isDialog="true" @flag="save" @close="close"></formTemplate>
			</el-dialog> -->
		</div>
	</div>
</template>

<script>
	import formTemplate from '@/components/form.vue'
	import tableForm from '@/components/tableForm.vue'
	export default {
		components: {
			tableForm,
			formTemplate
		},
		data() {
			return {
				dialogVisible:false,
				formData:{},
				companyId: this.$store.state.company.companyId,
				companyName: this.$store.state.company.companyName,
				userId: '',
				pageData: {
					items: []
				},
				page: 1,
				pageSize: $globalData.pageSize,
				data: [{
						type: 'text',
						prop: 'groupName',
						label: '设备分组'
					},
					{
						type: 'text',
						prop: 'equipmentModel',
						label: '设备型号'
					},
					{
						type: 'text',
						prop: 'supplierName',
						label: '供应商'
					},
					{
						type: 'text',
						prop: 'equipmentName',
						label: '设备名称'
					},
					{
						type: 'text',
						prop: 'communicationValue',
						label: '通讯协议'
					},
					{
						type: 'text',
						prop: 'networkTypeValue',
						label: '入网方式'
					},
					{
						type: 'text',
						prop: 'equipmentDesc',
						label: '设备参数描述'
					},
					{
						type: 'slot',
						prop: 'g',
						label: '操作',
						width: '100px'
					}
				]
			}
		},
		created() {
			this.$store.commit('digitalOrchard_leftNavIndex', 13)
			this.getListOfIoTDevices()
		},
		mounted() {
		},
		watch: {


		},
		methods: {
			getListOfIoTDevices(){
				if(this.$store.state.company.companyId){
					this.$request.get(this.$api.getListOfIoTDevices, {
					companyId: this.companyId,
					page:this.page,
					pageSize:this.pageSize
					}).then(res=>{
						if(res.code == 200){
							this.pageData.items = res.data.items
						}
					})
				}
			},
			save(flag){},
			detail(e,index){
				this.$router.push({
					path:'/IntelligentEquipment/myEquipment/lotAdd',
					query: { dictImageEquipmentId: e.dictImageEquipmentId }
				})
			},
			paginaClick(val){
				//分页函数
			}
		}
	}
</script>

<style scoped="scoped">
	.breadcrumb,
	.tableNavBox {
		padding: 20px;
	}

	.tableNavBox {
		padding-top: 0;
	}

	.tableTitle {
		font-size: 16px;
		font-family: Microsoft YaHei;
		font-weight: 400;
		color: #333333;
		line-height: 30px;
	}

	.menberConTitle {
		width: 100%;
		background: #F3F3F3;
		text-align: left;
		padding: 5px 20px;
		margin-bottom: 20px;
		margin-top: 20px;
	}

	.dialogVisible>>>.el-input__inner {
		width: 270px;
	}

	.isdelete {
		color: #F42929;
	}
</style>
